import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
//可视化分析项目构建大小
import {visualizer} from 'rollup-plugin-visualizer';
//开启gzip压缩
import compression from 'vite-plugin-compression';
import path from 'path'
// https://vite.dev/config/
export default defineConfig({
  base:'./',
  plugins: [vue() ,
      compression({
      verbose: true, // 控制台输出压缩结果
      disable: false, // 启用压缩
      threshold: 10240, // 仅压缩大于 10KB 的文件
      algorithm: 'gzip', // 使用 gzip 压缩
      ext: '.gz' // 文件后缀
       }),
      visualizer({
      filename: './dist/report.html', // 输出报告文件路径
      open: true, // 构建完成后自动打开报告文件
      gzipSize: true, // 显示 gzip 后的大小
      brotliSize: true // 显示 brotli 压缩后的大小
    }),
    createSvgIconsPlugin({
    iconDirs:[path.resolve(process.cwd(),'src/assets/icons')],
    symbolId: 'icon-[dir]-[name]',
  })],
  //开启chunk 将monaco-editor分离出来
  build:{
   chunkSizeWarningLimit: 1024,
    rollupOptions:{
      output:{
        manualChunks(id){
          if(id.includes('node_modules')){
            if(id.includes('md-editor-v3')){
              return 'md-editor-v3'
            }
            if(id.includes('monaco-editor')){
            return 'monaco-editor'
          }
          return 'vendor'
          }
        }
      }
    }
  },
  server:{
    port:8080
  },
  resolve:{
    alias:{
      "@":path.join(__dirname,'src')
    }
  },
  css:{
    preprocessorOptions:{
      scss:{
        sassOptions:{
          quietDeps:true
        }
      }
    }
  },
  optimizeDeps:{
    include:['monaco-editor']
  }
})
